<!doctype html>
<html>
<head>
<include file="Include:meta" />
<title>座位标签管理-目的地运营集团数据管理平台</title>
<include file="Include:style" />
<style type="text/css">
.operation-item{cursor:pointer;display:inline-block;}
.operation-btn{display:none;}
.operation-item:hover .operation-btn{display:inline;}
.second-list{width:310px;float:left;}
.toggle-item{ line-height: 30px; padding: 10px 70px; }
.toggle-item a{ width: 33.333%; display: inline-block; }
.form-item .name_btn{ color: #000; }
</style>
</head>
<body>
<include file="Include:header" />
<include file="Include:left" />
<div id="main">
	<div class="crumbs">
		<div class="crumbs-text">座位标签管理</div>
	</div>
	<div id="content">
		<div class="table-scrollx">
			<table class="table table-bordered table-hover">
				<tr class="table-header fixed-table-header">
					<td width="220" style="font-size: 14px;">
						一级分类
					</td>
					<td style="font-size: 14px;">
						二级分类<a href="javascript:;" class="ml5 second-add"><i class="glyphicon glyphicon-plus"></i></a>
					</td>
				</tr>
				<volist name="result" id="do">
					<tr> 
						<td>{$do['first_name']}</td>
						<td>
							<foreach name="do['second']" item="uo"> 
								<div class="second-list">
									<span class="operation-item">{$uo['second_name']}<span class="operation-btn">
										<a href="javascript:;" class="ml5 edit-btn" data-toggle="tooltip" data-placement="right" title="编辑"><i class="glyphicon glyphicon-edit"></i></a>
										<a href="javascript:;" class="ml5 delete-btn" data-toggle="tooltip" data-placement="right" title="删除" mid="{$uo['id']}" bool="{$uo['audit']}" labels="2"><i class="glyphicon glyphicon-trash"></i></a>
										<a second-id="{$uo['id']}" first-id="{$do['id']}" href="javascript:;" class="ml5 choice" data-toggle="tooltip" data-placement="right" title="批量操作"><i class="glyphicon glyphicon-import"></i></a>
										</span></span>
									<span class="edit-item hide">
										<input type="text" class="form-control edit-input w200" val="{$uo['second_name']}" />
										<input type="button" class="btn edit-confirm" mid="{$uo['id']}" labels="2" value="确认" />
										<input type="button" class="btn btn-default edit-cancel" value="取消" />
									</span>
								</div>
							</foreach>
						</td>
					</tr> 
				</volist>
			</table>
		</div>
	</div>
</div>
<include file="Public:footer"/>
<!--删除弹框-->
<div class="modal fade" id="modal-delete" >
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4>确认提示框</h4>
				<i class="fa fa-times" aria-hidden="true" data-dismiss="modal"></i>
			</div>
			<div class="modal-body">您确定要删除吗？</div>
			<div class="modal-footer">
				<button type="button" class="btn delete-confirm">确认</button>
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>
<!--有数据删除弹框-->
<div class="modal fade" id="modal-delete2" >
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4>确认提示框</h4>
				<i class="fa fa-times" aria-hidden="true" data-dismiss="modal"></i>
			</div>
			<div class="modal-body">
				您确定要删除吗？<br />
				删除后将该分类移至<span class="ml5"><select name="types{$k}[val][]" class="form-control select-sd" autocomplete="off"></select></span>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn delete-confirm">确认</button>
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>
<!--添加弹框-->
<div class="modal fade" id="modal-add" >
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4>添加分类</h4>
				<i class="fa fa-times" aria-hidden="true" data-dismiss="modal"></i>
			</div>
			<div class="modal-body">
				<table class="table table-bordered">
					<tr class="table-header">
						<td width="50%">一级分类</td>
						<td>二级分类</td>
					</tr>
					<tr>
						<td class="first-td">
							<select name="uid" class="w150 add-select">
								<option value="-10">姓名</option>
								<option value="58">IT类固资</option>
								<option value="59">行政固资</option>
							</select>
						</td>
						<td class="second-td">
							<input type="text" class="form-control add-input w150" />
						</td>
					</tr>
				</table>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn add-confirm">确认</button>
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>
<!--批量操作-->
<div id="detailModal" class="modal hide fade">
	<div class="modal-dialog w800">
		<div class="modal-content">
			<div class="modal-header">
				<h4 id="myModalLabel">批量操作</h4>
				<i class="fa fa-times" aria-hidden="true" data-dismiss="modal"></i>
			</div>
			<form name="detailModal">
				<div class="modal-body">
					<table class='table table-bordered'>
						
					</table>
					<input name="second_id" type="hidden">
					<input name="first_id" type="hidden">
				</div>
				<div class="modal-footer">
					<span class="error-item mr10">至少选择一项</span><button type="button" class="btn user-all">全选</button><button type="button" class="btn user-affirm">确认</button><button type="button" class="btn btn-default user-cancel" data-dismiss="modal">取消</button>
				</div>
			</form>
		</div>
	</div>
</div>
<include file="Include:javascript" />
<script type="text/javascript" src="__PUBLIC__/js/ddsort.js"></script>
<script type="text/javascript">
	$(function(){
		$('.choice').click(function(){
			var second = $(this).attr('second-id'),
				first = $(this).attr('first-id');
			$("[name='second_id']").val(second);
			$("[name='first_id']").val(first);
		})
		//全选
		$('body').on('click','.user-all',function(){
			$(this).addClass('user-active');
			$(this).html("取消全选");
			$('.modal-body').find('.user-checkbox').prop("checked",true);
		})
		$('body').on('click','.user-active',function(){
			$(this).removeClass('user-active');
			$(this).html("全选");
			$('.modal-body').find('.user-checkbox').removeAttr("checked");
		})
		//分类
		$(".choice").click(function(){
			var cid = $(this).attr('second-id');
			$.ajax({
				type:"POST",
				async:false,
				dataType:"json",
				url:"__APP__/Administration/seat_type_ajax",
				data:{"id":cid,"action":"detail"},
				success:function(data){
					if(data){
						var html="";

						html+= "<tr>";
						for(var i=0;i<data.length;i++){
							html+= "<td>";
							html+= "<label class='checkbox-inline'><input class='user-checkbox' type='checkbox' name='main_id[]' value="+data[i].id+" ";
							if(data[i].check==1){
								html+= "checked";
							}
							html+= "/></label>"+data[i].users+"";
							if(data[i].aaa==1){
								html+= "("+data[i].seat_number+")";
							}
							html+= "</td>";
							if((i+1)%6==0){
								html+= "</tr>";
							}
						}
						html+= "</tr>";
						$('#detailModal').find('table').html(html);
					}else{
						$('#detailModal').find('table').html("<tr class='table-header'><td colspan='4'>名称</td></tr><tr><td class='Text_c' colspan='4'>暂无相关内容</td></tr>");
					}
				}
			});
		});
		$('.user-checkbox').click(function(){
			$('.modal-footer').find('.error-item').hide();
		})
		//反选提交
		$("#detailModal .user-affirm").click(function(){
			var tag = true;
			if($('.user-checkbox:checked').length==0){
				tag = false;
				$('.modal-footer').find('.error-item').show();
			}
			if(tag){
				$.ajax({
					type:"POST",
					async:false,
					dataType:"json",
					data:$("[name='detailModal']").serialize()+"&action=dodetail",
					url:"__APP__/Administration/seat_type_ajax",
					success:function(data){
						success_pop(data.status,data.msg);
					}
				});
			}
		})
		$("#folderModal .form-item input").focus(function(){
			$(this).next('.error-item').hide();
		})
		//部门全选
		$('body').on("click",".department-checkbox",function(){
			var $ul = $(this).parents(".department").next("ul");
			if($(this).prop("checked")){
				$ul.find(".user-checkbox:enabled").prop("checked",true);
			}else{
				$ul.find(".user-checkbox:enabled").prop("checked",false);
				$usermodal.find(".all-checkbox").prop("checked",false);
			}
		});
		//全选
		$('body').on('click','.user-all',function(){
			$(this).addClass('user-active');
			$(this).html("取消全选");
			$('.modal-body').find('.user-checkbox').prop("checked",true);
		})
		$('body').on('click','.user-active',function(){
			$(this).removeClass('user-active');
			$(this).html("全选");
			$('.modal-body').find('.user-checkbox').removeAttr("checked");
		})
		//编辑
		$(".edit-btn").on("click",function(){
			var operation_item = $(this).parents(".operation-item"),
				edit_item = operation_item.next(".edit-item"),
				edit_input = edit_item.find(".edit-input"),
				visible = $("table").find(".edit-item:visible");
			visible.find(".edit-cancel").trigger("click");
			operation_item.hide();
			edit_item.show();
			edit_input.val(edit_input.attr("val"));
		});
		//编辑取消
		$(".edit-cancel").on("click",function(){
			var edit_item = $(this).parent(".edit-item").show(),
				operation_item = edit_item.prev(".operation-item"),
				edit_input = edit_item.find(".edit-input");
			operation_item.show();
			edit_item.hide();
			edit_input.removeClass("red");
		});
		//编辑确认
		$(".edit-confirm").on("click",function(){
			var edit_item = $(this).parent(".edit-item"),
				edit_input = edit_item.find(".edit-input"),
				val = edit_input.val(),
				mid = $(this).attr("mid"),
				labels = $(this).attr("labels");
			if(!edit_input.hasClass("red")){
				if(val==""){
					edit_input.val("必填项").addClass("red");
				}else if(/\s/.test(val)){
					edit_input.val("不能含有空格").addClass("red");
				}else{
					$.ajax({
						type:"POST",
						async:false,
						dataType:"json",
						url:"__APP__/Administration/seat_type_ajax",
						data:{"name":val,"id":mid,"action":"doedit"},
						success:function(data){
							success_pop(data['status'],data['msg']);
						}
					});
				}
			}
		});
		//删除
		$(".delete-btn").on("click",function(){
			var mid = $(this).attr("mid"),
				bool = $(this).attr("bool"),
				labels = $(this).attr("labels");
			if(bool){
				$("#modal-delete").modal("toggle").find(".delete-confirm").attr({"mid":mid,"labels":labels,"bool":bool});
			}else{
				var modal = $("#modal-delete2");
				$.ajax({
					type:"POST",
					async:false,
					dataType:"json",
					url:"__APP__/Index/label_administration_status",
					data:{"id":mid,"labels":3},
					success:function(data){
						var option = "";
						for(var i=0;i<data.length;i++){
							option+="<option value="+data[i].id;
							if(data[i].second_name=="其它"){
								option+=" selected ";
							}
							option+=">"+data[i].second_name+"</option>";
						}
						modal.find("select.select-sd").html(option);
					}
				});
				modal.find(".delete-confirm").attr({"mid":mid,"labels":labels});
				modal.modal("toggle");
			}
		});
		//删除确认
		$("#modal-delete").find(".delete-confirm").on("click",function(){
			var mid = $(this).attr("mid"),
				bool = $(this).attr("bool"),
				labels = $(this).attr("labels");
			$("#modal-delete").hide();
			$.ajax({
				type:"POST",
				async:false,
				dataType:"json",
				url:"__APP__/Administration/seat_type_ajax",
				data:{"id":mid,"labels":labels,"action":"delete","bool":bool},
				success:function(data){
					success_pop(data['status'],data['msg']);
				}
			});
		});
		$("#modal-delete2").find(".delete-confirm").on("click",function(){
			var mid = $(this).attr("mid"),
				labels = $(this).attr("labels"),
				cid = $("#modal-delete2").find("select.select-sd").val();
			$("#modal-delete2").hide();
			$.ajax({
				type:"POST",
				async:false,
				dataType:"json",
				url:"__APP__/Administration/seat_type_ajax",
				data:{"id":mid,"labels":labels,"cid":cid,"action":"delete","bool":""},
				success:function(data){
					success_pop(data['status'],data['msg']);
				}
			});
		});
		//二级分类添加
		$(document).on("click",".second-add",function(){
			$("#modal-add").modal("toggle");
		});
		//添加确认
		$("#modal-add").find(".add-confirm").on("click",function(){
			var table = $(this).parents("#modal-add").find("table"),
				labels = $(this).attr("labels"),
				tag = true;
			table.find("input.add-input").each(function(){
				var val = $(this).val();
				$(this).next(".red").remove();
				if(val==""){
					tag = false;
					$(this).after("<span class='red ml5'>必填项</span>");
				}else if(/\s/.test(val)){
					tag = false;
					$(this).after("<span class='red ml5'>不能含有空格</span>");
				}
			});
			table.find("select.add-select").each(function(){
				var val = $(this).val();
				if(val==-10){
					tag = false;
					$(this).nextAll(".red").remove();
					$(this).next(".select2").after("<span class='red ml5'>必填项</span>");
				}
			});
			if(tag){
				var first = "",
					second = "",
					first = table.find("select.add-select").val(),
					second = table.find(".add-input").val();
				$("#modal-add").hide();
				$.ajax({
					type:"POST",
					async:false,
					dataType:"json",
					url:"__APP__/Administration/seat_type_ajax",
					data:{"first":first,"second":second,"action":"doadd"},
					success:function(data){
						success_pop(data['status'],data['msg']);
					}
				});
			}
		});
		//取消错误提示
		$(".edit-input").on("focus",function(){
			if($(this).hasClass("red")){
				$(this).val("").removeClass("red");
			}
		});
		$("#modal-add").on("focus",".add-input",function(){
			$(this).next(".red").remove();
		});
		$("#modal-add").on("change",".add-select",function(){
			$(this).nextAll(".red").remove();
		});
		
		//批量操作
		$(".choice").on("click",function(){
			var mid = $(this).attr("mid");
			$("#detailModal").find(".modal-body").end().modal();
		});
	});
</script>
</body>
</tr>